<template>
<div class="audit-panel-group">
    <div class="panel">
        <div class="panel-header bd">
            <div class="bl"></div>
            <div class="title">付款信息</div>
        </div>
        <div class="panel-body">
            <div class="list-group">
                <div class="list-item">
                    <div class="row">
                        <div class="title">发起人</div>
                        <div class="value">{{ payment.user.realname }}</div>
                    </div>
                </div>

                <div class="list-item">
                    <div class="row">
                        <div class="title">付款编号</div>
                        <div class="value">{{ payment.pay_no }}</div>
                    </div>
                </div>

                <div class="list-item">
                    <div class="row">
                        <div class="title">付款类型</div>
                        <div class="value">{{ payment.type.title }}</div>
                    </div>
                </div>

                <div class="list-item">
                    <div class="row">
                        <div class="title">申请付款日期</div>
                        <div class="value">{{ payment.create_time  }}</div>
                    </div>
                </div>

                <div class="list-item">
                    <div class="row">
                        <div class="title">付款金额</div>
                        <div class="value">{{ payment.total }}</div>
                    </div>
                </div>

                <div class="list-item">
                    <div class="row">
                        <div class="title">备注</div>
                    </div>
                    <div class="intro">{{ payment.intro }}</div>

                </div>

                <div class="list-item">
                    <div class="row">
                        <div class="title">凭证</div>
                        <div class="value"></div>
                    </div>
                    <div class="intro">
                        <div v-if="payment.receipt.length > 0" class="order-files">
                            <upload-file-list :file-list="payment.receipt"></upload-file-list>
                        </div>
                    </div>
                </div>

                <div class="list-item">
                    <div class="row">
                        <div class="title">收据</div>
                        <div class="value"></div>
                    </div>
                    <div class="intro">
                        <div v-if="payment.note.length > 0" class="order-files">
                            <upload-file-list :file-list="payment.receipt"></upload-file-list>
                        </div>
                    </div>
                </div>
            </div>

        </div>
    </div>
</div>
</template>

<script>
import uploadFileList from '@/components/files/index';

export default {
    name: "AuditPayment",
    components: {
        uploadFileList
    },
    props: {
        payment: {
            type: Object,
            default: function () {
                return {
                    order_id: '',
                    pay_no: '',
                    pay_type_id: '',
                    income_type_id: '',
                    apply_date: '',
                    total: '',
                    receipt: [],
                    note: [],
                    type: {
                        id: '',
                        title: ''
                    },
                    user: {
                        id: '',
                        realname: '',
                        status: ''
                    }
                };
            }
        }
    },
    data() {
        return {

        };
    },
    computed: {
        receipt: function () {
            if (Array.isArray(this.payment.receipt)) {
                return this.payment.receipt.map(e=>e.url)
            }
            return [];
        },
        note: function () {
            if (Array.isArray(this.payment.note)) {
                return this.payment.note.map(e=>e.url)
            }
            return [];
        }
    },
    methods: {

    }
}
</script>
